import 'package:flutter/material.dart';

//层叠布局 Stack、Positioned

class StackPositionedRoute extends StatefulWidget {
  @override
  _StackPositionedRouteState createState() => _StackPositionedRouteState();
}

class _StackPositionedRouteState extends State<StackPositionedRoute> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text("层叠布局 Stack、Positioned")),
        body: _MyConstrainedBox());
  }
}

class _MyConstrainedBox extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    //通过ConstrainedBox来确保Stack占满屏幕,
    return ConstrainedBox(
      constraints: BoxConstraints.expand(),
      child: Stack(
        alignment: Alignment.center,
        fit: StackFit.expand,//未定位widget占满stack整个空间
        children: <Widget>[
          //叠层到下面
          Positioned(
            left: 18.0,
            child: Text("I am jack"),
          ),
          Container(
            child: Text(
              "Hello World",
              style: TextStyle(color: Colors.white),
            ),
            color: Colors.red,
          ),


          Positioned(
            top: 18.0,
            child: Text("your friend"),
          ),
        ],
      ),
    );
  }
}
